<template>
	<vk-data-dialog
		v-model="value.show"
		:title="page.title"
		:top="page.top"
		:width="page.width"
		:close-on-click-modal="true"
		mode="form"
		@open="onOpen"
		@closed="onClose"
	>
		<view style="padding: 20px;" v-loading="page.loading">
			<!-- 页面主体内容开始 -->
			<userTagscom v-if="value.show" v-model="form1.tags" :userInfo="value.item"></userTagscom>
			<!-- 页面主体内容结束 -->
		</view>
		<template v-slot:footer>
			<el-button :loading="page.btnLoading" size="small" style="width: 80px;" @click="close">取消</el-button>
			<el-button :loading="page.btnLoading" type="primary" size="small" style="width: 80px;" @click="save">保存</el-button>
		</template>
	</vk-data-dialog>
</template>

<script>
var that; // 当前页面对象
var vk = uni.vk; // vk实例

import userTagscom from './userTagscom'

export default {
	components:{
		userTagscom,
	},
	props: {
		value: {
			Type: Object,
			default: function() {
				return {
					show: false,
					mode: "",
					item: "",
					options: ""
				};
			}
		}
	},
	data: function() {
		// 组件创建时,进行数据初始化
		return {
			page: {
				title: "标签",
				submitText: "关闭",
				top: "7vh",
				width: "600px",
				loading: false,
				btnLoading: false
			},
			form1:{
				tags:[]
			}
		};
	},
	mounted() {
		that = this;
		that.init();
	},
	methods: {
		// 初始化
		init() {
			let { value } = that;
			that._input(value);
		},
		_input(value) {
			that.$emit("input", value);
		},
		// 监听 - 页面打开
		onOpen() {
			that = this;
		},
		// 监听 - 页面关闭
		onClose() {},
		// 打开页面
		open() {
			let { value } = that;
			value.show = true;
			that._input(value);
		},
		// 关闭页面
		close() {
			let { value } = that;
			value.show = false;
			that._input(value);
		},
		save(){
			vk.callFunction({
				url: 'admin/business/sys/user.updateUserTag',
				loading:{ that, name:"page.btnLoading" },
				data:{
					_id: that.value.item._id,
					tags: that.form1.tags,
				},
				success:function(data){
					that.$emit("success");
					that.close();
				}
			});
		}
	},
	watch: {
		
	},
	// 计算属性
	computed: {

	}
};
</script>

<style lang="scss" scoped>
	.el-tag{
		cursor: pointer;
		user-select: none;
	}
 .el-tag + .el-tag {
    margin-left: 10px;
  }
  .button-new-tag {
    margin-left: 10px;
    height: 32px;
    line-height: 30px;
    padding-top: 0;
    padding-bottom: 0;
  }
  .input-new-tag {
    width: 90px;
    margin-left: 10px;
    vertical-align: bottom;
  }
</style>
